//1、完成基础需求， 然后创建store文件
import React from 'react'
import { useDispatch, useSelector } from "react-redux";

//引入封装好的传值函数
import {
  incrementAction,
  decrementAction,
  waitIncrementAction
} from '../../store/actions/countAction'


export default function Index() {
  const dispatch = useDispatch()
  // console.log(dispatch);
  // //解析store的count初始值
  const count = useSelector(state=>{
    return state.count.count
  })
  console.log(count);
  
  // console.log(count);
  //累加
    const incrementHandle = ()=>{
      //传输一个对象，里面是类型和值
      dispatch(incrementAction(1))
    }

    // 累减
    const decrementHandle = ()=>{
      dispatch(decrementAction(1))
    }

    // 奇数时累加
    const ifOddIncrementHandle = ()=>{
      //判断奇数
      if(count%2 !== 0 ){
        dispatch(incrementAction(1))
      }
    }

    // 延时累加
    const waitIncrementHandle = ()=>{
      dispatch(waitIncrementAction(1))
    }

    //因为方便管理，所以使用专门处理的文件夹action和常数文件countConst来处理
  
  
  return (
    <div>
      <h1>这是变化的数据【{count}】</h1>

      <button onClick={incrementHandle}>累加</button>&nbsp;
      <button onClick={decrementHandle} >累减</button> &nbsp;
      <button onClick={ifOddIncrementHandle}>奇数时累加</button> &nbsp;
      <button onClick={waitIncrementHandle}>延时累加</button> 
    </div>
  )
}
